<template>
		<el-row  :gutter="24"  >
			<div style="margin-left: 10px; margin-right: 10px;margin-bottom: 8px;"  :key="shortcut.id" v-for="shortcut in shortcutList">
				<shortcutCard
					:icon="shortcut.icon ? shortcut.icon : 'menu-outlined'"
					:label="shortcut.title+'&nbsp;&nbsp;&nbsp;'"
					@click="leaevFor(shortcut.path)"
				/>
			</div>
		</el-row>
</template>

<script setup name="shortcut">
  import auth from '@/plugins/auth'
	import shortcutCard from '@/components/ShortcutCard/index.vue'
  import { reactive, onMounted,getCurrentInstance } from "vue";
  import {getShortcutMenu} from '@/api/menu.js'
	import {useRouter} from "vue-router";
  const router = useRouter();
  const shortcutList = ref([])

	onMounted(() => {
		// 进来后执行查询
    getShortcutMenuList()
	})

	const getShortcutMenuList = () => {

    shortcutList.value = [
      {
        "id": "1",
        "title": "环境配置",
        "icon": "edit",
        "path": "/pricing/Env"
      },
      {
        "id": "2",
        "title": "接口管理 ",
        "icon": "textarea",
        "path": "/pricing/Inf"
      },
	  {
        "id": "3",
        "title": "自动化测试 ",
        "icon": "guide",
        "path": "/pricing/AutoTest"
      },
	  {
        "id": "4",
        "title": "一键压测 ",
        "icon": "nested",
        "path": "/pricing/OneKeySst"
      },
	  {
        "id": "5",
        "title": "测试报告 ",
        "icon": "chart",
        "path": "/pricing/Report"
      }
    ]
  }

	const leaevFor = (url) => {
    url = url.replace("/index","")
		router.push({
			path: url
		})
	}


</script>

<style scoped>
	.ant-list-item {
		padding: 8px 0px !important;
	}
</style>
